import React, { Component } from 'react'

export default class TodoItem extends Component {

    updataHandler=(id) => {
    //    console.log(this)
       console.log("id =" + this.props.id)
       this.props.statusHandler(this.props.id)
    }
    removeHandler = (id) => {
        this.props.deteleHandler(this.props.id)
    }
    render() {
        return (
            <div>
                <input type="checkbox" checked={this.props.isCompleted} onChange={this.updataHandler}/>
                事项    {this.props.title}      {this.props.isCompleted ? <span style ={{color:"red"}}>已完成</span> : <span style ={{color:"blue"}}>未完成</span>}
                &nbsp;&nbsp;<button onClick={this.updataHandler}>点击修改状态</button>       
                &nbsp;&nbsp;<button onClick={this.removeHandler}>删除</button>
            </div>
        )
    }
}
